/* reset */
body,h1,h2,h3,h4,h5,h6,pre,form,input,textarea,p {padding: 0;margin: 0;}
h1,h2,h3,h4,h5,h6 {font-weight: normal;font-size: 100%;}
input,textarea {outline: none;border: none;}
a {text-decoration: none;}
img {display: block;}
.ellipsis-1 {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.ellipsis-2 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
#app {
    width: 10rem;
    margin: 0 auto;
}
.F5 {
    background: #F5F5F5;
}
.F6 {
    background: #F6F6F6;
}
.F7 {
    background: #F7F7F7;
}
.FF {
    background: #FFFFFF;
}
/* 弹窗 */
.popup {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    overflow: auto;
    display: none;
}
/* 顶部 */
.header {
    .header-height {
        width: 10rem;
        height: 1.1733rem;
        background: #FFFFFF;
    }
    .header-wrap {
        position: fixed;
        z-index: 9;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 10rem;
        height: 1.1733rem;
        .header-content {
            width: 10rem;
            height: 1.1733rem;
            position: relative;
            display: flex;
            justify-content: center;
            line-height: 1.1733rem;
            background-color: rgba(255, 255, 255, 0.9);
            color: #000000;
            .left {
                position: absolute;
                left: .4rem;
                top: 0;
                height: 1.1733rem;
                display: flex;
                align-items: center;
                .go-back {
                    width: .5867rem;
                    height: .5867rem;
                    cursor: pointer;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .text {
                    margin-left: .16rem;
                    font-size: .48rem;
                    height: 1.1733rem;
                    line-height: 1.1733rem;
                }
            }
            .title {
                height: 1.1733rem;
                font-size: .4533rem;
            }
        }
    }
}
/* 底部tabBar */
.tab-bar-wrap {
    .bar-height {
        height: 1.3333rem;
    }
    .tab-bar {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
        width: 10rem;
        height: 1.3333rem;
        display: flex;
        justify-content: center;
        align-items: center;
        background: #FFFFFF;
        .item {
            width: 2.42rem;
            height: 1.3333rem;
            background: #FFFFFF;
            display: flex;
            flex-direction: column;
            align-items: center;
            cursor: pointer;
            .icon {
                margin-top: .1333rem;
                width: .6933rem;
                height: .6933rem;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .icon img:last-of-type {
                display: none;
            }
            .title {
                margin-top: .08rem;
                height: .2667rem;
                font-size: .2667rem;
                line-height: .2667rem;
                color: #666666;
            }
        }
        .item.active {
            .icon img:first-of-type {
                display: none;
            }
            .icon img:last-of-type {
                display: block;
            }
            .title {
                color: #376CFD;
            }
        }
    }
}
/* 轮播样式 */
.carousel-container {
    overflow: hidden;
    position: relative;
    .carousel-wrapper {
        display: flex;
        width: 100%;
        height: 100%;
        transition: transform 0.5s ease-in-out;
        .carousel-item {
            min-width: 100%;
            height: 100%;
        }
    }
    .carousel-dots {
        position: absolute;
        display: flex;
        .dot {
            cursor: pointer;
            transition: background-color 0.3s;
        }
    }
}
/* 首页 */
.index-page {
    .header-box {
        width: 10rem;
        height: 8.2933rem;
        background: #FFFFFF;
        overflow: hidden;
        position: relative;
        z-index: 0;
        .circle1 {
            position: absolute;
            left: 1.7867rem;
            top: -6.8267rem;
            width: 13.1733rem;
            height: 13.1733rem;
            border-radius: 50%;
            background: linear-gradient(149deg, #1D42EF 7%, #366AF9 83%);
        }
        .circle2 {
            position: absolute;
            left: -5.9467rem;
            bottom: 2.4533rem;
            width: 14.5067rem;
            height: 14.5067rem;
            border-radius: 50%;
            background: linear-gradient(106deg, #366BFD 10%, #376CFD 88%);
        }
        .user-box {
            position: absolute;
            left: .48rem;
            bottom: 5.76rem;
            height: 1.0357rem;
            display: flex;
            align-items: center;
            cursor: pointer;
            .avatar {
                flex-shrink: 0;
                width: 1.0357rem;
                height: 1.0357rem;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .nickname-box {
                margin-left: .2176rem;
                .nickname {
                    height: .5824rem;
                    width: 6.6667rem;
                    line-height: .5867rem;
                    font-size: .4267rem;
                    font-weight: 500;
                    color: #FFFFFF;
                }
                .tag-name {
                    height: .4533rem;
                    line-height: .4533rem;
                    font-size: .32rem;
                    color: rgba(255, 255, 255, 0.6);
                }
            }
        }
        .erji {
            position: absolute;
            bottom: 5.84rem;
            right: .5067rem;
            width: .6933rem;
            height: .6933rem;
            cursor: pointer;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .banner {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            bottom: 1.5467rem;
            width: 9.2533rem;
            height: 3.76rem;
            border-radius: .16rem;
            overflow: hidden;
            #carousel1 {
                width: 100%;
                height: 100%;
                .carousel-item {
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .carousel-dots {
                    left: 50%;
                    transform: translateX(-50%);
                    bottom: .2133rem;
                    .dot {
                        margin-right: .1067rem;
                        width: .1067rem;
                        height: .1067rem;
                        border-radius: .0533rem;
                        background: #FFFFFF;
                    }
                    .dot.active {
                        width: .4267rem;
                    }
                }
            }
        }
        .notice-box {
            position: absolute;
            bottom: .2933rem;
            left: 50%;
            transform: translateX(-50%);
            width: 9.2rem;
            height: .88rem;
            border-radius: 4.73px;
            opacity: 1;
            background: #F8F8FA;
            display: flex;
            align-items: center;
            .notice-label {
                margin-left: .3733rem;
                height: .88rem;
                font-size: .4419rem;
                line-height: .88rem;
                font-weight: bold;
                color: #333333;
                flex-shrink: 0;
                span {
                    color: #F83F35
                }
            }
            .notice-text {
                margin-left: 18px;
                height: .88rem;
                width: 6.4rem;
                font-size: .3787rem;
                line-height: .88rem;
                letter-spacing: 0px;
                color: #333333;
            }
        }
    }
    .two-box {
        margin: .32rem auto 0;
        width: 9.36rem;
        display: flex;
        justify-content: space-between;
        .top {
            margin-top: .2667rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .title {
                margin-left: .2667rem;
                width: 1.4933rem;
                height: .5333rem;
                font-size: .3749rem;
                line-height: .5333rem;
                color: #000000;
            }
            .more {
                margin-right: .3579rem;
                height: .5333rem;
                line-height: .5333rem;
                display: flex;
                align-items: center;
                font-size: .2667rem;
                line-height: .5333rem;
                color: #FFFFFF;
                background: linear-gradient(90deg, #3467F8 0%, #4E7DFC 100%);
                padding: 0 .2277rem 0 7.89px;
                border-radius: .24rem;
                border-bottom-left-radius: 0;
                cursor: pointer;
                img {
                    margin-left: .0888rem;
                    width: .0936rem;
                    height: .1472rem;
                }
            }
        }
        .left {
            margin-left: 6px;
            width: 4.4533rem;
            height: 6.48rem;
            border-radius: .2677rem;
            background: #EFF4FF;
            overflow: hidden;
            #carousel2 {
                margin: .2165rem auto 0;
                width: 3.9093rem;
                height: 3.9093rem;
                border-radius: .2141rem;
                background: #FFFFFF;
                border: .0267rem solid #A3DDFF;
                .carousel-item {
                    position: relative;
                    cursor: pointer;
                    .jian {
                        position: relative;
                        margin-top: .1339rem;
                        margin-left: .1605rem;
                        width: .5333rem;
                        height: .5333rem;
                        img {
                            position: absolute;
                            top: 0;
                            left: 0;
                            position: absolute;
                            width: 100%;
                            height: 100%;
                        }
                        span {
                            position: absolute;
                            top: 50%;
                            left: 50%;
                            transform: translate(-50%,-50%);
                            font-size: .348rem;
                            color: #FFFFFF;
                            font-weight: 500;
                        }
                    }
                    .product-image {
                        position: absolute;
                        height: 2.9187rem;
                        top: 50%;
                        left: 50%;
                        transform: translate(-50%,-50%);
                        img {
                            width: auto;
                            height: 100%;
                        }
                    }
                }
                .carousel-dots {
                    left: .2133rem;
                    bottom: .2133rem;
                    .dot {
                        margin-right: .0533rem;
                        width: .1067rem;
                        height: .0533rem;
                        border-radius: .0533rem;
                        background: #F0F0F0;
                    }
                    .dot.active {
                        width: .2133rem;
                        background: #A3DDFF;
                    }
                }
            }
            .product-title {
                margin: .2667rem auto 0;
                width: 3.7867rem;
                height: .5333rem;
                line-height: .5333rem;
                font-size: .3749rem;
                color: #333333;
                text-align: center;
            }
            .point-box {
                margin-top: .112rem;
                margin-left: .3733rem;
                height: .4267rem;
                display: flex;
                align-items: center;
                img {
                    width: .3733rem;
                    height: .3733rem;
                }
                span {
                    line-height: .4267rem;
                    height: .4267rem;
                    margin-left: .1067rem;
                    font-size: 16px;
                    color: #3467F8;
                }
            }
        }
        .right {
            width: 4.4533rem;
            height: 6.48rem;
            border-radius: .2677rem;
            background: linear-gradient(180deg, #BFFFE8 -5%, #FFFFFF 27%);
            overflow: hidden;
            .product-list {
                margin: .2667rem auto 0;
                display: flex;
                flex-wrap: wrap;
                width: 3.8933rem;
                justify-content: space-between;
                .item {
                    margin-bottom: .216rem;
                    width: 1.8667rem;
                    cursor: pointer;
                    .product-image {
                        width: 1.8667rem;
                        height: 1.8667rem;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        box-sizing: border-box;
                        border: .0267rem solid #A3DDFF;
                        border-radius: .2141rem;
                        img {
                            max-width: 90%;
                            max-height: 90%;
                        }
                    }
                    .product-title {
                        margin-top: .0533rem;
                        width: 1.8667rem;
                        text-align: center;
                        height: .5067rem;
                        line-height: .5067rem;
                        font-size: .348rem;
                        color: #333333;
                    }
                }
            }
        }
    }
    .video-box {
        margin: .3467rem auto 0;
        width: 9.36rem;
        height: 7.2264rem;
        border-radius: .16rem;
        overflow: hidden;
        position: relative;
        box-shadow: 0px 4.13px 20.65px 0px rgba(104, 128, 235, 0.1),inset 0px 1.03px 1.03px 0px #FFFFFF;
        .bg {
            width: 9.36rem;
            height: 7.2264rem;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .content {
            position: absolute;
            left: 0;
            top: 0;
            width: 9.36rem;
            height: 7.2264rem;
            .top {
                margin-top: .4131rem;
                display: flex;
                justify-content: space-between;
                align-items: center;
                .title {
                    margin-left: .5232rem;
                    height: .6608rem;
                    line-height: .6608rem;
                    font-size: .4955rem;
                    color: #FFFFFF;
                }
                .more-box {
                    margin-right: .2203rem;
                    height: .6608rem;
                    padding: 0 .3027rem 0 .2752rem;
                    border-radius: .1067rem;
                    background: #FFF0DD;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    .point {
                        width: .1101rem;
                        height: .1101rem;
                        border-radius: 50%;
                        background: #AF8151;
                        margin-right: .1101rem;
                    }
                    .text {
                        width: 78.95%;
                        height: .6608rem;
                        line-height: .6608rem;
                        font-size: .3853rem;
                        font-weight: 500;
                        color: #AF8151;
                    }
                }
            }
            .article-list {
                margin: .7733rem auto 0;
                .article-item {
                    margin: 0 auto;
                    display: flex;
                    justify-content: space-between;
                    width: 8.5341rem;
                    height: 2.5603rem;
                    padding: .2203rem .2885rem .2245rem 12.62px;
                    box-sizing: border-box;
                    border-radius: .2885rem;
                    background: #FFFFFF;
                    margin-top: .1376rem;
                    cursor: pointer;
                    .left {
                        display: flex;
                        flex-direction: column;
                        justify-content: space-between;
                        .title {
                            margin-top: .1885rem;
                            width: 4.4232rem;
                            height: 1.0667rem;
                            font-size: .3845rem;
                            line-height: .5333rem;
                            color: #111111;
                        }
                        .bottom {
                            height: .2885rem;
                            display: flex;
                            justify-content: space-between;
                            align-items: center;
                            color: #9E9E9E;
                            font-size: .2885rem;
                            .time-box {
                                height: .2885rem;
                                display: flex;
                                align-items: center;
                                img {
                                    width: .2885rem;
                                    height: .2885rem;
                                }
                                span {
                                    margin-left: .1203rem;
                                }
                            }
                            .right-text {
                                height: .2885rem;
                                line-height: .2885rem;
                            }
                        }
                    }
                    .right {
                        width: 3.0291rem;
                        height: 2.1155rem;
                        img {
                            width: 100%;
                            height: 100%;
                        }
                    }
                }
                .article-item:first-of-type {
                    margin-top: 0;
                }
            }
        }
    }
    .recommend-box {
        margin: .5067rem auto 0;
        .title {
            height: .7467rem;
            display: flex;
            align-items: center;
            justify-content: center;
            .left {
                width: .8533rem;
                height: .0267rem;
                border-radius: .0267rem;
                background: linear-gradient(90deg, rgba(150, 150, 150, 0) 0%, #969696 100%);
            }
            .right {
                width: .8533rem;
                height: .0267rem;
                border-radius: .0267rem;
                background: linear-gradient(90deg, #969696 0%, rgba(150, 150, 150, 0) 100%);
            }
            .middle {
                margin: 0 .2667rem;
                font-size: 20px;
                line-height: .7467rem;
                color: #333333;
            }
        }
        .list {
            margin: .5067rem auto 0;
            width: 9.36rem;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            .item {
                border-radius: 4px;
                overflow: hidden;
                padding-bottom: 11px;
                margin-bottom: 10px;
                background: #FFFFFF;
                .product-image {
                    width: 4.5333rem;
                    height: 4.5333rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .product-title {
                    margin-top: .3733rem;
                    margin-left: .2667rem;
                    width: 4rem;
                    height: .4rem;
                    font-size: .4rem;
                    line-height: .4rem;
                    color: #333333;
                }
                .bottom {
                    margin: .2933rem auto 0;
                    width: 4rem;
                    height: .64rem;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    .point-box {
                        height: .64rem;
                        display: flex;
                        align-items: center;
                        img {
                            width: .3733rem;
                            height: .3733rem;
                        }
                        span {
                            margin-left: .1067rem;
                            height: .4267rem;
                            font-size: .4267rem;
                            line-height: .4267rem;
                            color: #3467F8;
                        }
                    }
                    .btn {
                        padding: 0 .2933rem;
                        height: .64rem;
                        line-height: .64rem;
                        border-radius: .32rem;
                        color: #FFFFFF;
                        font-size: .32rem;
                        background: linear-gradient(90deg, #7ADCFA 0%, #3467F8 100%);
                        box-shadow: 0px 3px 6px 0px rgba(122, 220, 250, 0.29);
                        cursor: pointer;
                    }
                }
            }
        }
    }
}
/* 达人升级 */
.drsj-page {
    .top-wrap {
        width: 10rem;
        height: 4.6667rem;
        position: relative;
        img {
            width: 100%;
            height: 100%;
        }
        .title {
            position: absolute;
            top: .8rem;
            left: 0;
            width: 10rem;
            height: 1.2rem;
            line-height: 1.2rem;
            font-size: .5333rem;
            font-weight: bold;
            color: #FFFFFF;
            text-align: center;
        }
    }
    .card-list {
        position: relative;
        margin: -2.16rem auto 0;
        width: 8.3467rem;
        .item {
            width: 100%;
            height: 2.96rem;
            border-radius: 10px;
            background: #F3E0B3;
            overflow: hidden;
            margin-bottom: .2667rem;
            cursor: pointer;
            .top {
                margin-top: .32rem;
                width: 1.6533rem;
                height: .6933rem;
                background: linear-gradient(113deg, #3D3634 0%, #827776 100%);
                border-top-right-radius: .3467rem;
                border-bottom-right-radius: .3467rem;
                overflow: hidden;
                img {
                    margin-top: .1333rem;
                    margin-left: .1867rem;
                    width: 1.0667rem;
                    height: .4267rem;
                }
            }
            .middle {
                margin-top: .1867rem;
                height: .6667rem;
                display: flex;
                justify-content: space-between;
                .left {
                    margin-left: .5067rem;
                    height: .6667rem;
                    font-size: .48rem;
                    line-height: .6667rem;
                    color: #333333;
                }
                .right {
                    margin-right: .7733rem;
                    height: .6667rem;
                    display: flex;
                    align-items: center;
                    img {
                        width: .72rem;
                        height: .6667rem;
                        margin-left: .24rem;
                    }
                }
            }
            .bottom {
                margin-top: .16rem;
                margin-left: .5067rem;
                height: .4533rem;
                font-size: .32rem;
                line-height: .4533rem;
                color: #B88640;
            }
        }
        .item:nth-of-type(2) {
            background: #E4CDC2;
        }
        .item:nth-of-type(3) {
            background: #5C5660;
            .middle .left{
                color: #FAD2A5;
            }
            .bottom {
                color: #FAD2A5;
            }
        }
    }
}
/* 会员升级 */
.hysj-page {
    padding-bottom: .6933rem;
    .top-wrap {
        width: 10rem;
        height: 4.0533rem;
        overflow: hidden;
        position: relative;
        .bg-list {
            img:nth-of-type(1) {
                position: absolute;
                top: 0;
                left: 0;
                width: 10rem;
                height: 4.0533rem;
            }
            img:nth-of-type(2) {
                position: absolute;
                top: 2.2667rem;
                left: .4rem;
                width: 9.2rem;
                height: 2.72rem;
                border-radius: .2667rem;
            }
            img:nth-of-type(3) {
                position: absolute;
                left: 0;
                top: 3.3259rem;
                width: 10rem;
                height: 2.1867rem;
            }
            img:nth-of-type(4) {
                position: absolute;
                left: 3.2rem;
                top: 2.2667rem;
                width: .2381rem;
                height: 1.512rem;
            }
            img:nth-of-type(5) {
                position: absolute;
                left: 3.6701rem;
                top: 2.2667rem;
                width: .5245rem;
                height: 1.564rem;
            }
            img:nth-of-type(6) {
                position: absolute;
                left: 4.1536rem;
                top: 2.2667rem;
                width: .8864rem;
                height: 1.5733rem;
            }
        }
        .content {
            position: absolute;
            top: 0;
            left: 0;
            width: 10rem;
            .user-info {
                margin-top: .4267rem;
                margin-left: .4rem;
                height: 1.6rem;
                display: flex;
                .left {
                    width: 1.6rem;
                    height: 1.6rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .right {
                    margin-left: .2667rem;
                    .row-1 {
                        margin-top: .0533rem;
                        height: .5867rem;
                        font-size: .4267rem;
                        font-weight: .5867rem;
                        color: #FFFFFF;
                    }
                    .row-2 {
                        margin-top: .3467rem;
                        height: .4rem;
                        font-size: .2933rem;
                        line-height: .4rem;
                        color: #FFFFFF;
                    }
                }
            }
            .desc-wrap {
                margin-top: .56rem;
                display: flex;
                justify-content: space-between;
                .desc {
                    margin-left: .8533rem;
                    height: .5333rem;
                    font-size: .3733rem;
                    line-height: .5333rem;
                    color: #FAD2A5;
                }
                .tips-box {
                    margin-right: .8267rem;
                    width: 1.28rem;
                    height: .5333rem;
                    border-radius: .2667rem;
                    box-sizing: border-box;
                    border: .0267rem solid #FFFFFF;
                    line-height: .48rem;
                    font-size: .32rem;
                    color: #FFFFFF;
                    text-align: center;
                }
            }
        }
    }
    .product-wrap {
        .product-box {
            margin-top: .96rem;
            .title-wrap {
                display: flex;
                justify-content: center;
                align-items: center;
                height: .64rem;
                img {
                    width: .4rem;
                    height: .2667rem;
                }
                .title {
                    margin: 0 .2533rem;
                    height: .64rem;
                    line-height: .64rem;
                    color: #333333;
                    font-size: .4533rem;
                }
            }
            .subtitle-wrap {
                margin-top: .16rem;
                height: .4533rem;
                line-height: .4533rem;
                color: #875E2B;
                font-size: .32rem;
                text-align: center;
                span {
                    margin-left: .4rem;
                }
            }
            .product-list {
                margin: .5067rem auto 0;
                width: 9.1467rem;
                display: flex;
                flex-wrap: wrap;
                .product-item {
                    margin-right: 12px;
                    margin-bottom: .4267rem;
                    width: 2.8267rem;
                    height: 4.2133rem;
                    position: relative;
                    .selected-img {
                        display: none;
                        position: absolute;
                        left: .24rem;
                        top: .16rem;
                        width: .48rem;
                        height: .48rem;
                        img {
                            width: 100%;
                            height: 100%;
                        }
                    }
                    .product-image {
                        width: 2.8267rem;
                        height: 2.8267rem;
                        border-radius: .1067rem;
                        overflow: hidden;
                        box-sizing: border-box;
                        background: linear-gradient(180deg, #D4E9FF -29%, #FFFFFF 92%);
                        img {
                            width: 100%;
                            height: 100%;
                        }
                    }
                    .product-title {
                        margin: .2133rem auto 0;
                        width: 2.72rem;
                        height: .5067rem;
                        font-size: .3467rem;
                        line-height: .5067rem;
                        color: #333333;
                    }
                    .bottom {
                        height: .6133rem;
                        line-height: .6133rem;
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        .left {
                            height: .6133rem;
                            font-size: .4267rem;
                            color: #F73131;
                            span {
                                font-size: .2933rem;
                            }
                        }
                        .right {
                            height: .6133rem;
                            display: flex;
                            align-items: center;
                            .minus-wrap,.add-wrap {
                                width: .4432rem;
                                height: .4533rem;
                                position: relative;
                                .out {
                                    width: 100%;
                                    height: 100%;
                                }
                                .in {
                                    position: absolute;
                                    left: 50%;
                                    top: 50%;
                                    transform: translate(-50%,-50%);
                                    width: .2216rem;
                                }
                            }
                            .minus-wrap .in {
                                height: .0453rem;
                            }
                            .add-wrap .in {
                                height: .2267rem;
                            }
                            .number {
                                font-weight: .6133rem;
                                font-size: .3101rem;
                                color: #2E343A;
                                padding: 0 .1773rem;
                            }
                        }
                    }
                }
                .product-item:nth-of-type(3n) {
                    margin-right: 0;
                }
                .product-item.active .selected-img {
                    display: block;
                }
                .product-item.active .product-image {
                    border: .0267rem solid #2493F1;
                }
            }
        }
        .product-box:first-of-type {
            margin-top: .32rem;
        }
    }
    .commit-btn {
        margin: 1.44rem auto 0;
        width: 8.2933rem;
        height: 1.28rem;
        line-height: 1.28rem;
        border-radius: .64rem;
        text-align: center;
        background: #C6C7CB;
        color: #FFFFFF;
        font-size: .4267rem;
        font-weight: 500;
    }
    .commit-btn.active {
        background-color: #2493F1;
    }
}
/* 邀请朋友 */
.invite-page {
    padding-bottom: .4rem;
    .top-wrap {
        width: 10rem;
        position: relative;
        .invite-bg1 {
            width: 10rem;
            height: 5.5467rem;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .sph {
            position: absolute;
            top: .4533rem;
            left: 3.28rem;
            width: 3.44rem;
            height: 1.5467rem;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .text {
            position: absolute;
            top: 1.7867rem;
            left: 50%;
            transform: translateX(-50%);
            width: 10rem;
            height: 1.2rem;
            font-size: .5333rem;
            font-weight: bold;
            line-height: 1.2rem;
            color: #FFFFFF;
            text-align: center;
        }
    }
    .middle-wrap {
        margin: -2.2933rem auto 0;
        width: 9.2rem;
        height: 12.7067rem;
        border-radius: .4rem;
        overflow: hidden;
        position: relative;
        .invite-bg2 {
            width: 9.2rem;
            height: 12.7067rem;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .content {
            position: absolute;
            top: 0;
            left: 0;
            width: 9.2rem;
            height: 12.7067rem;
            .top-box {
                margin: .5333rem auto 0;
                width: 8.1867rem;
                height: 8.1867rem;
                position: relative;
                #carousel1 {
                    width: 100%;
                    height: 100%;
                    .carousel-item {
                        img {
                            width: 100%;
                            height: 100%;
                        }
                    }
                }
                .to-left {
                    position: absolute;
                    top: 50%;
                    left: -0.3333rem;
                    transform: translateY(-50%);
                    width: .6667rem;
                    height: .6667rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .to-right {
                    position: absolute;
                    top: 50%;
                    right: -0.3333rem;
                    transform: translateY(-50%);
                    width: .6667rem;
                    height: .6667rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
            }
            .bottom-box {
                margin-top: .2933rem;
                display: flex;
                .left {
                    margin-left: .3733rem;
                    width: 3.1733rem;
                    height: 3.1733rem;
                    flex-shrink: 0;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .right {
                    margin-left: .2667rem;
                    .user-box {
                        margin-top: .24rem;
                        height: 1.0357rem;
                        display: flex;
                        align-items: center;
                        cursor: pointer;
                        .avatar {
                            flex-shrink: 0;
                            width: 1.0357rem;
                            height: 1.0357rem;
                            img {
                                width: 100%;
                                height: 100%;
                            }
                        }
                        .nickname-box {
                            margin-left: .2176rem;
                            .nickname {
                                height: .5333rem;
                                width: 3.7333rem;
                                line-height: .5333rem;
                                font-size: .3733rem;
                                font-weight: 500;
                                color: #000000;
                            }
                            .tag-name {
                                height: .3733rem;
                                line-height: .3733rem;
                                font-size: .2667rem;
                                color: rgba(0, 0, 0, 0.5);
                            }
                        }
                    }
                    .share-code {
                        display: inline-block;
                        margin-top: .3243rem;
                        padding: 0 .2667rem;
                        height: .56rem;
                        line-height: .56rem;
                        border-radius: .8rem;
                        text-align: center;
                        color: #000000;
                        font-size: .3467rem;
                        background: linear-gradient(90deg, rgba(36, 147, 241, 0.2) 0%, rgba(125, 199, 255, 0.2) 100%);
                    }
                    .tips {
                        margin-top: .2133rem;
                        height: .48rem;
                        font-size: .3467rem;
                        line-height: .48rem;
                        color: #333333;
                    }
                }
            }
        }
    }
    .click-tips {
        margin-top: .3333rem;
        height: .4267rem;
        font-size: .2933rem;
        font-weight: .4267rem;
        line-height: 16px;
        text-align: center;
        // color: #646466
        .blue {
            color: #1A66FF
        }
    }
    .btn-list {
        margin-top: .4267rem;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 1.12rem;
        line-height: 1.12rem;
        .left-btn,.right-btn {
            margin-right: .5333rem;
            width: 3.36rem;
            height: 1.12rem;
            line-height: 1.12rem;
            border-radius: .8rem;
            background: linear-gradient(90deg, #44D7B6 0%, #5EF2D2 100%);
            color: #FFFFFF;
            text-align: center;
            font-size: .4rem;
            cursor: pointer;
        }
        .right-btn {
            background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
        }
    }
    .popup-content {
        position: fixed;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        z-index: 1000;
        width: 10rem;
        height: 5.8133rem;
        background: #FFFFFF;
        border-top-left-radius: .5333rem;
        border-top-right-radius: .5333rem;
        display: none;
        .title {
            margin-top: .5067rem;
            height: .56rem;
            font-size: .4rem;
            line-height: .56rem;
            text-align: center;
            color: #333333;
        }
        .middle {
            margin-top: 23px;
            display: flex;
            justify-content: center;
            .left,.right  {
                width: 3.1467rem;
                display: flex;
                flex-direction: column;
                align-items: center;
                cursor: pointer;
                .img {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    width: 1.3867rem;
                    height: 1.3867rem;
                    background: linear-gradient(90deg, #3FD57B 0%, #8EEB79 100%);
                    border-radius: 50%;
                    img {
                        max-width: .8rem;
                        max-height: .8rem;
                    }
                }
                .text {
                    margin-top: .1333rem;
                    height: .5333rem;
                    font-size: .3733rem;
                    line-height: .5333rem;
                    text-align: center;
                    color: #333333;
                }
            }
            .right .img {
                background: linear-gradient(90deg, #9EDB14 0%, #C9EE3F 100%);
            }
        }
        .cancel-btn {
            margin-top: .8267rem;
            height: .64rem;
            font-size: .4533rem;
            line-height: .64rem;
            text-align: center;
            color: #333333;
        }
    }
}
/* 我的 */
.wd-page {
    .top-wrap {
        width: 10rem;
        height: 5.6133rem;
        position: relative;
        overflow: hidden;
        .bg {
            position: absolute;
            left: 0;
            top: -1.0267rem;
            width: 10rem;
            height: 6.64rem;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .top-content {
            position: absolute;
            width: 10rem;
            height: 5.6133rem;
            left: 0;
            top: 0;
            .header-wrap {
                width: 10rem;
                height: 1.1733rem;
                display: flex;
                align-items: center;
                .go-back {
                    margin-left: .4rem;
                    width: .5867rem;
                    height: .5867rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .text {
                    margin-left: .16rem;
                    height: .6667rem;
                    font-size: .48rem;
                    line-height: .6667rem;
                    color: #FFFFFF;
                }
            }
            .user-info {
                margin-top: .3867rem;
                margin-left: .4rem;
                height: 1.6rem;
                display: flex;
                .left {
                    width: 1.6rem;
                    height: 1.6rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .right {
                    margin-left: .2667rem;
                    .row-1 {
                        margin-top: .16rem;
                        height: .7467rem;
                        display: flex;
                        .nickname {
                            width: 2.64rem;
                            height: .7467rem;
                            font-size: .48rem;
                            line-height: .7467rem;
                            color: #FFFFFF;
                        }
                        .vip-box {
                            margin-top: .16rem;
                            margin-left: .1333rem;
                            width: 1.76rem;
                            height: .48rem;
                            position: relative;
                            .vip-bg {
                                left: 0;
                                top: 0;
                                width: 1.76rem;
                                height: .48rem;
                            }
                            .royal {
                                position: absolute;
                                top: .0533rem;
                                left: .2056rem;
                                width: .3491rem;
                                height: .3491rem;
                            }
                            .vip-text {
                                position: absolute;
                                top: 0;
                                left: .6381rem;
                                font-size: .2184rem;
                                height: .48rem;
                                line-height: .48rem;
                                color: #464048;
                            }
                        }
                    }
                    .row-2 {
                        height: .5333rem;
                        font-size: .3733rem;
                        line-height: .5333rem;
                        color: rgba(255, 255, 255, 0.8);
                        display: flex;
                        div {
                            margin-right: .48rem;
                        }
                    }
                }
            }
            .layer1 {
                margin-top: .32rem;
                height: .5867rem;
                display: flex;
                justify-content: space-between;
                align-items: center;
                .left {
                    margin-left: 1.1733rem;
                    color: #FFE1C0;
                    font-size: .3733rem;
                    font-weight: bold;
                    height: .5867rem;
                    line-height: .5867rem;
                }
                .right {
                    margin-right: 1.0283rem;
                    height: .5867rem;
                    display: flex;
                    align-items: center;
                    div {
                        height: .5867rem;
                        line-height: .5867rem;
                        font-size: .32rem;
                        color: #FFE1C0;
                    }
                    img {
                        width: .2933rem;
                        height: .2933rem;
                    }
                }
            }
            .upgrade {
                position: absolute;
                top: 2.0933rem;
                right: .4rem;
                width: 1.5467rem;
                height: .72rem;
                border-radius: .3733rem;
                background: linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0.8) 100%);
                display: flex;
                align-items: center;
                cursor: pointer;
                div {
                    margin-left: .3704rem;
                    color: #2493F1;
                    height: .72rem;
                    line-height: .72rem;
                    font-size: .3293rem;
                }
                img {
                    width: .3051rem;
                    height: .3051rem;
                }
            }
        }
    }
    .layer2 {
        margin: -1.44rem auto 0;
        width: 9.2rem;
        height: 2.6667rem;
        position: relative;
        border-radius: .2133rem;
        overflow: hidden;
        img {
            width: 100%;
            height: 100%;
        }
        .content {
            position: absolute;
            left: 0;
            top: 0;
            width: 9.2rem;
            height: 2.6667rem;
            .layer2-top {
                margin-top: .4267rem;
                display: flex;
                height: .5333rem;
                .left {
                    display: flex;
                    height: .5333rem;
                    img {
                        margin-left: .48rem;
                        width: .5333rem;
                        height: .5333rem;
                    }
                    span {
                        margin-left: .1333rem;
                        height: .5333rem;
                        line-height: .5333rem;
                        font-size: .4267rem;
                        color: #FFDBB5;
                    }
                }
                .right {
                    margin-left: .1867rem;
                    margin-top: .1067rem;
                    height: .4rem;
                    font-size: .32rem;
                    line-height: .4rem;
                    color: #FFDBB5;
                }
            }
            .layer2-bottom {
                margin-top: .4533rem;
                display: flex;
                align-items: center;
                justify-content: space-between;
                .left {
                    margin-left: .64rem;
                    height: .8rem;
                    font-size: .8rem;
                    line-height: .8rem;
                    color: #FFDBB5;
                }
                .right {
                    margin-right: .3733rem;
                    height: .6933rem;
                    padding: 0 .4267rem;
                    border-radius: .3467rem;
                    background: linear-gradient(90deg, #FFEACB 0%, #E8BC77 100%);
                    font-family: Alibaba PuHuiTi 2.0;
                    font-size: .32rem;
                    line-height: .6933rem;
                    text-align: center;
                    color: #333333;
                }
            }
        }
    }
    .middle-wrap {
        margin: .2667rem auto 0;
        width: 9.2rem;
        height: 2.9867rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        display: flex;
        justify-content: space-between;
        overflow: hidden;
        .item {
            width: 2.2667rem;
            display: flex;
            flex-direction: column;
            align-items: center;
            img {
                margin-top: .56rem;
                width: 1.2rem;
                height: 1.2rem;
            }
            div {
                margin-top: .16rem;
                height: .5067rem;
                font-size: .3467rem;
                line-height: .5067rem;
                color: #333333;
            }
        }
    }
    .bottom-wrap {
        margin: .2667rem auto 0;
        width: 9.2rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        .item {
            display: flex;
            justify-content: space-between;
            height: 1.4933rem;
            align-items: center;
            cursor: pointer;
            .left {
                margin-left: .24rem;
                height: 1.4933rem;
                display: flex;
                align-items: center;
                .icon {
                    width: .64rem;
                    height: .64rem;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    img {
                        max-width: 100%;
                        max-width: 100%;
                    }
                }
                .title {
                    margin-left: .1867rem;
                    height: .64rem;
                    line-height: .64rem;
                    color: #1A1F2D;
                    font-size: .4rem;
                }
            }
            .right {
                margin-right: .32rem;
                width: .4267rem;
                height: .4267rem;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
        }
        .item:nth-of-type(1) .icon img {
            width: .4667rem;
            height: .4435rem;
        }
        .item:nth-of-type(2) .icon img {
            width: .4667rem;
            height: .42rem;
        }
        .item:nth-of-type(3) .icon img {
            width: .64rem;
            height: .64rem;
        }
        .item:nth-of-type(4) .icon img {
            width: .5333rem;
            height: .5333rem;
        }
        .item:nth-of-type(5) .icon img {
            width: .5867rem;
            height: .5867rem;
        }
        .item:nth-of-type(6) .icon img {
            width: .64rem;
            height: .64rem;
        }
    }
    .version-content {
        margin: .2667rem auto .4267rem;
        height: .4267rem;
        font-size: .2933rem;
        line-height: .4267rem;
        text-align: center;
        color: #646466;
        span {
            margin-left: .2667rem;
            color: #1A66FF
        }
    }
}
/* 积分钱包 */
.point-wallet-page {
    padding-bottom: .2667rem;
    .top-wrap {
        width: 10rem;
        height: 4.2667rem;
        position: relative;
        .bg {
            width: 10rem;
            height: 4.2667rem;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .content {
            position: absolute;
            left: 0;
            top: 0;
            width: 10rem;
            height: 4.2667rem;
            display: flex;
            justify-content: space-between;
            .left {
                margin-top: .6667rem;
                margin-left: .4rem;
                height: 1.52rem;
                .point-row {
                    display: flex;
                    .number {
                        height: .96rem;
                        font-size: 1.0667rem;
                        line-height: .96rem;
                        color: #FFFFFF;
                    }
                    .coin {
                        margin-top: .3733rem;
                        width: .5867rem;
                        height: .5867rem;
                        img {
                            width: 100%;
                            height: 100%;
                        }
                    }
                }
                .rule {
                    height: .4rem;
                    line-height: .4rem;
                    margin-top: .1333rem;
                    font-size: .2933rem;
                    color: #FFFFFF;
                }
            }
            .right {
                margin-top: .7733rem;
                margin-right: .4rem;
                width: 2.2133rem;
                height: 1.12rem;
                border-radius: .8rem;
                background: linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0.8) 100%);
                display: flex;
                align-items: center;
                justify-content: center;
                div {
                    height: 1.12rem;
                    line-height: 1.12rem;
                    font-size: .4rem;
                    color: #2493F1;
                }
                img {
                    width: .3733rem;
                    height: .3733rem;
                }
            }
        }
    }
    .rows-wrap {
        margin: -1.7067rem auto 0;
        width: 9.2rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        position: relative;
        overflow: hidden;
        padding-bottom: .8rem;
        .title {
            margin-top: .3467rem;
            height: .6667rem;
            font-family: Alibaba PuHuiTi 2.0;
            font-size: .48rem;
            line-height: .6667rem;
            color: #2493F1;
            text-align: center;
            font-weight: 600;
        }
        .rows {
            .item {
                margin: .4267rem auto 0;
                width: 8.3467rem;
                height: 1.0933rem;
                display: flex;
                justify-content: space-between;
                align-items: center;
                .left {
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    .text {
                        height: .5333rem;
                        font-size: .3733rem;
                        line-height: .5333rem;
                        color: #333333;
                    }
                    .time {
                        height: .4533rem;
                        font-size: .32rem;
                        line-height: .4533rem;
                        color: #777777;
                    }
                }
                .right {
                    height: .5867rem;
                    font-size: .4267rem;
                    line-height: .5867rem;
                    color: #2493F1;
                }
            }
        }
    }
}
/* 收款账号 */
.acount-page {
    .top-wrap {
        margin: .4533rem auto 0;
        width: 9.2rem;
        height: 2.72rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        position: relative;
        overflow: hidden;
        .row {
            margin-top: .9867rem;
            margin-left: .6133rem;
            display: flex;
            .pay-logo {
                height: .7733rem;
                width: auto;
                img {
                    height: 100%;
                    width: auto;
                }
            }
            .name {
                margin-top: .16rem;
                margin-left: .4rem;
                height: .5333rem;
                font-size: .3733rem;
                line-height: .5333rem;
                color: #333333;
            }
        }
        .default {
            position: absolute;
            top: .3733rem;
            right: .56rem;
            height: .48rem;
            padding: 0 .48rem;
            background: #3388FF;
            font-size: .2933rem;
            line-height: .48rem;
            color: #FFFFFF;
        }
    }
    .rows-wrap {
        margin: 16px auto 0;
        width: 9.2rem;
        min-height: 7.3867rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        padding: .2933rem 0;
        .rows {
            .item {
                height: 1.3867rem;
                display: flex;
                justify-content: space-between;
                align-items: center;
                position: relative;
                .left {
                    height: 1.3867rem;
                    display: flex;
                    align-items: center;
                    .icon {
                        margin-left: .4rem;
                        min-width:  .7467rem;
                        height: .64rem;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        img {
                            max-height: 100%;
                            width: auto;
                        }
                    }
                    span {
                        margin-left: .1867rem;
                        font-size: .4rem;
                        font-weight: 600;
                        color: #333333;
                    }
                }
                .right {
                    height: 1.3867rem;
                    display: flex;
                    align-items: center;
                    .qrcode {
                        width: .9867rem;
                        height: .9867rem;
                    }
                    span {
                        font-size: 14px;
                        line-height: .5333rem;
                        color: #B6BDBD;
                        margin-right: .1013rem;
                    }
                    .right-icon {
                        margin-right: .32rem;
                        width: .72rem;
                        height: .8509rem;
                    }
                }
                .bottom-line {
                    position: absolute;
                    left: 50%;
                    transform: translateX(-50%);
                    bottom: 0;
                    width: 8.5067rem;
                    height: .0267rem;
                    background: rgba(216, 216, 216, 0.2);
                }
            }
        }
    }
    .bottom-wrap {
        position: fixed;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        width: 10rem;
        height: 1.8133rem;
        background: #FFFFFF;
        display: flex;
        justify-content: center;
        align-items: center;
        .edit-btn {
            width: 9.2rem;
            height: 1.12rem;
            line-height: 1.12rem;
            border-radius: .56rem;
            background: #2493F1;
            text-align: center;
            color: #FFFFFF;
            font-size: .4267rem;
        }
    }
    .bottom-wrap-height {
        height: 2.6133rem;
    }
}
/* 提现 */
.withdrawal-page {
    .top-wrap {
        margin: .4533rem auto 0;
        width: 9.2rem;
        height: 3.4933rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        position: relative;
        overflow: hidden;
        .title {
            margin-top: .5067rem;
            margin-left: .4267rem;
            height: .56rem;
            font-size: .4rem;
            line-height: .56rem;
            color: #333333;
        }
        .amount-box {
            margin-top: .3733rem;
            display: flex;
            align-items: center;
            height: .9067rem;
            .symbol {
                margin-left: .4267rem;
                width: .64rem;
                height: .9067rem;
                font-size: 24px;
                line-height: .9067rem;
                color: #333333;
                text-align: center;
            }
            input {
                margin-left: .24rem;
                width: 31.19%;
                height: .5333rem;
                font-size: .3733rem;
                line-height:  .5333rem;
                color: #333333;
            }
            input::placeholder {
                font-size: .3733rem;
                color: #B6BDBD;
            }
        }
        .hr {
            margin: .16rem auto 0;
            width: 8.2933rem;
            height: 1px;
            background: #EDEEF2;
        }
        .bottom-text {
            margin-top: .16rem;
            margin-left: .5333rem;
            height: .4267rem;
            display: flex;
            line-height: .4267rem;
            align-items: center;
            font-size: .2933rem;
            .text {
                height: .4267rem;
                line-height: .4267rem;
                color: #646466
            }
            .btn {
                margin-left: .2667rem;
                height: .4267rem;
                line-height: .4267rem;
                color: #1A66FF;
                cursor: pointer;
            }
        }
    }
    .payway-wrap {
        margin: .4267rem auto 0;
        width: 9.2rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        overflow: hidden;
        padding-bottom: .6667rem;
        .title {
            margin-top: .5067rem;
            margin-left: .4267rem;
            height: .56rem;
            font-size: .4rem;
            line-height: .56rem;
            color: #333333;
        }
        .list {
            margin-top: .8533rem;
            margin-left: .8533rem;
            display: flex;
            flex-wrap: wrap;
            .item {
                width: 1.8667rem;
                margin-right: .8533rem;
                margin-bottom: .2667rem;
                position: relative;
                cursor: pointer;
                .image {
                    width: 1.8667rem;
                    height: 1.28rem;
                    border-radius: .16rem;
                    background: #FFFFFF;
                    box-sizing: border-box;
                    border: .0267rem solid #2493F1;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    img {
                        max-height: .7467rem;
                        max-width: 1.3333rem;
                    }
                }
                .text {
                    margin-top: .1067rem;
                    height: .5333rem;
                    font-size: .3733rem;
                    line-height: .5333rem;
                    color: #333333;
                    text-align: center;
                }
                .sel-img {
                    position: absolute;
                    left: -0.24rem;
                    top: -0.24rem;
                    width: .48rem;
                    height: .48rem;
                    display: none;
                }
            }
            .item.active .sel-img {
                display: block;
            }
        }
    }

    .bottom-btn {
        position: fixed;
        left: 50%;
        bottom: .8rem;
        transform: translateX(-50%);
        width: 8.2933rem;
        height: 1.28rem;
        line-height: 1.28rem;
        text-align: center;
        color: #FFFFFF;
        font-size: .4267rem;
        border-radius: .64rem;
        background: #2493F1;
        cursor: pointer;
    }
}
.my-recommend-page {
    padding-bottom: .3467rem;
    .container {
        margin: .3467rem auto 0;
        width: 9.2rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        padding-bottom: .48rem;
        overflow: hidden;
        .search-box {
            margin: .48rem auto 0;
            width: 8.3467rem;
            height: .96rem;
            border-radius: .8rem;
            background: #F2F2F2;
            display: flex;
            align-items: center;
            img {
                margin-left: 2.4rem;
                width: .4533rem;
                height: .4533rem;
                cursor: pointer;
            }
            input {
                margin-left: .16rem;
                width: 4rem;
                height: .48rem;
                font-size: .3467rem;
                line-height: .48rem;
                color: #666666;
                background: #F2F2F2;
            }
            input::placeholder {
                font-size: .3467rem;
                color: #BDBDBD;
            }
        }
        .list {
            margin-top: .08rem;
            .item {
                margin: .0533rem auto 0;
                width: 8.3467rem;
                height: 2.1867rem;
                background: #FFFFFF;
                box-shadow: 0px 1px 0px 0px #EEEEEE;
                position: relative;
                overflow: hidden;
                display: flex;
                .avatar {
                    margin-top: .4533rem;
                    width: 1.3333rem;
                    height: 1.3333rem;
                    img {
                        border-radius: 50%;
                        width: 100%;
                        height: 100%;
                    }
                }
                .info {
                    margin-left: .2667rem;
                    .nickname-box {
                        margin-top: .4533rem;
                        height: .5333rem;
                        display: flex;
                        align-items: center;
                        .nickname {
                            height: .5333rem;
                            font-size: .3733rem;
                            line-height: .5333rem;
                            color: #333333;
                        }
                        .daren {
                            margin-left: .1333rem;
                            width: 1.2rem;
                            height: .3733rem;
                            position: relative;
                            img {
                                width: 100%;
                                height: 100%;
                            }
                            .text {
                                position: absolute;
                                top: 0;
                                left: 0;
                                width: 1.2rem;
                                height: .3733rem;
                                line-height: .3733rem;
                                text-align: center;
                                color: #232734;
                                font-size: .2667rem;
                            }
                        }
                    }
                    .phone {
                        margin-top: .2933rem;
                        height: .48rem;
                        font-size: .3467rem;
                        line-height: .48rem;
                        color: #666666;
                    }
                }
                .right-row1,.right-row2 {
                    position: absolute;
                    right: 0;
                    top: .7467rem;
                    font-size: .32rem;
                    height: .4533rem;
                    line-height: .4533rem;
                    color: #999999;
                }
                .right-row2 {
                    top: 1.2rem;
                }
            }
        }
    }
}
/* 会员升级2 */
.hysj2-page {
    padding-bottom: .88rem;
    .top-wrap {
        width: 10rem;
        height: 4.0533rem;
        overflow: hidden;
        position: relative;
        .bg-list {
            img {
                position: absolute;
                top: 0;
                left: 0;
                width: 10rem;
                height: 4.0533rem;
            }
        }
        .content {
            position: absolute;
            top: 0;
            left: 0;
            width: 10rem;
            .user-info {
                margin-top: .4267rem;
                margin-left: .4rem;
                height: 1.6rem;
                display: flex;
                .left {
                    width: 1.6rem;
                    height: 1.6rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .right {
                    margin-left: .2667rem;
                    .row-1 {
                        margin-top: .0533rem;
                        height: .5867rem;
                        font-size: .4267rem;
                        font-weight: .5867rem;
                        color: #FFFFFF;
                    }
                    .row-2 {
                        margin-top: .1867rem;
                        height: .56rem;
                        display: flex;
                        align-items: baseline;
                        .text-left {
                            margin-top: .16rem;
                            height: .4rem;
                            font-size: .2933rem;
                            line-height: .4rem;
                            color: #FFFFFF;
                        }
                        .text-right {
                            font-size: .3931rem;
                            height: .56rem;
                            line-height: .56rem;
                            color: #FFFFFF;
                        }
                    }
                }
            }
        }
    }
    .product-wrap {
        margin: -1.7867rem auto 0;
        position: relative;
        width: 9.2rem;
        height: 22.28rem;
        background: #FFFFFF;
        border-radius: .2667rem;
        box-shadow: 0px 3px 6px 0px rgba(177, 177, 177, 0.16);
        overflow: hidden;
        .product-box {
            margin-top: .8533rem;
            .title-wrap {
                display: flex;
                height: .6667rem;
                .title {
                    margin-left: .3733rem;
                    margin-right: .3467rem;
                    height: .6667rem;
                    line-height: .6667rem;
                    color: #000000;
                    font-size: .48rem;
                }
                .amount-text{
                    height: .56rem;
                    font-size: .32rem;
                    line-height: .56rem;
                    color: #2493F1;
                    display: flex;
                    align-items: baseline;
                    span:nth-of-type(1) {
                        font-size: .32rem;
                    }
                    span:nth-of-type(2) {
                        font-size: .2704rem;
                    }
                    span:nth-of-type(3) {
                        font-size: .3931rem;
                    }
                }
            }
            .product-list {
                margin: .2933rem auto 0;
                width: 8.48rem;
                display: flex;
                flex-wrap: wrap;
                .product-item {
                    margin-right: .32rem;
                    margin-bottom: .38rem;
                    width: 2.6133rem;
                    height: 3.8867rem;
                    position: relative;
                    .product-image {
                        width: 2.6133rem;
                        height: 2.6133rem;
                        border-radius: .1067rem;
                        overflow: hidden;
                        box-sizing: border-box;
                        img {
                            width: 100%;
                            height: 100%;
                        }
                    }
                    .product-title {
                        margin: .1971rem auto 0;
                        width: 2.6133rem;
                        height: .4533rem;
                        font-size: .32rem;
                        line-height: .4533rem;
                        color: #333333;
                    }
                    .bottom {
                        margin-top: .0643rem;
                        height: .56rem;
                        line-height: .56rem;
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        .left {
                            height: .56rem;
                            font-size: .3931rem;
                            color: #F73131;
                            span {
                                font-size: .2704rem;
                            }
                        }
                        .right {
                            margin-right: .1579rem;
                            height: .56rem;
                            font-size: .3195rem;
                            color: rgba(51, 51, 51, 0.5);
                        }
                    }
                }
                .product-item:nth-of-type(3n) {
                    margin-right: 0;
                }
                .product-item.active .selected-img {
                    display: block;
                }
                .product-item.active .product-image {
                    border: .0267rem solid #2493F1;
                }
            }
        }
        .product-box:first-of-type {
            margin-top: .32rem;
        }
    }
    .btn-wrap {
        margin-top: .8rem;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 1.12rem;
        text-align: center;
        line-height: 1.12rem;
        color: #FFFFFF;
        font-size: .4rem;
        .btn {
            width: 3.36rem;
            border-radius: .56rem;
            background: linear-gradient(90deg, #44D7B6 0%, #5EF2D2 100%);
        }
        .right-btn {
            margin-left: .5333rem;
            background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
        }
    }
}
/* 任务列表 */
.tasklist-page {
    padding-bottom: .5333rem;
    .top-wrap {
        width: 10rem;
        height: 3.4667rem;
        background: #FFFFFF;
        border-top: .0267rem solid #ECECEC;
        box-sizing: border-box;
        overflow: hidden;
        .title {
            margin-top: .5333rem;
            margin-left: .5333rem;
            height: .96rem;
            font-size: .6133rem;
            line-height: .96rem;
            color: #000000;
        }
        .progress-bar {
            margin: .32rem auto 0;
            width: 9.2rem;
            height: .4rem;
            border-radius: .8rem;
            background: #EEEEEE;
            position: relative;
            .progress {
                position: absolute;
                left: 0;
                top: 0;
                height: .4rem;
                border-radius: .8rem;
                background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
            }
        }
        .desc {
            margin-top: .24rem;
            margin-left: .4rem;
            height: .4267rem;
            font-size: .2933rem;
            line-height: .4267rem;
            color: #646466;
        }
    }
    .list-wrap {
        margin: .4267rem auto 0;
        width: 9.2rem;
        overflow: hidden;
        .item {
            margin-bottom: .32rem;
            width: 9.2rem;
            height: 2.1867rem;
            border-radius: .2667rem;
            background: #FFFFFF;
            overflow: hidden;
            position: relative;
            .tag {
                width: 1.4667rem;
                height: .56rem;
                position: absolute;
                left: 0;
                top: 0;
                border-radius: .2667rem 0px .2667rem 0;
                background: #EAFEF5;
                text-align: center;
                font-size: .32rem;
                line-height: .56rem;
                color: #2EBC8C;
            }
            .tag.blue {
                background: #F1F8FF;
                color: #339CF3;
            }
            .orange {
                background: #FEF4EA;
                color: #F37D33;
            }
            .row {
                display: flex;
                .rank {
                    margin-top: .8267rem;
                    margin-left: .56rem;
                    width: .4533rem;
                    height: .5333rem;
                    font-size: .3733rem;
                    line-height: .5333rem;
                    color: #333333;
                }
                .avatar {
                    margin-top: .4267rem;
                    margin-left: .2667rem;
                    width: 1.3333rem;
                    height: 1.3333rem;
                    border-radius: 50%;
                    overflow: hidden;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .name-box {
                    margin-left: .2667rem;
                    .nickname {
                        margin-top: .6133rem;
                        height: .5333rem;
                        font-size: .3733rem;
                        line-height: .5333rem;
                        color: #333333;
                    }
                    .phone {
                        height: .48rem;
                        font-size: .3467rem;
                        line-height: .48rem;
                        color: #666666;
                    }
                }
            }
            .right-wrap {
                top: .1067rem;
                right: 0;
                position: absolute;
                height: 2.08rem;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                .btn {
                    margin-right: 20px;
                    margin-left: auto;
                    right: .5333rem;
                    top: .72rem;
                    width: 2.1333rem;
                    height: .8533rem;
                    border-radius: .4267rem;
                    text-align: center;
                    line-height: .8533rem;
                    font-size: .4rem;
                    background: #EEEEEE;
                    color: #666666;
                    cursor: pointer;
                }
                .btn.green {
                    color: #FFFFFF;
                    background: linear-gradient(90deg, #44D7B6 0%, #5EF2D2 100%), linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
                }
                .btn.blue {
                    color: #FFFFFF;
                    background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
                }
                .time {
                    margin-top: .1067rem;
                    margin-right: .4267rem;
                    margin-left: auto;
                    height: .48rem;
                    font-size: .32rem;
                    line-height: .48rem;
                    color: #EE2C2C;
                }
            }
        }
    }
}
/* 任务审核 */
.taskaudit-page {
    padding-bottom: .5333rem;
    .top-wrap {
        margin: .3733rem auto 0;
        width: 9.2rem;
        height: 2.3467rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        display: flex;
        justify-content: space-between;
        position: relative;
        .line {
            position: absolute;
            left: 4.4533rem;
            top: 50%;
            transform: translateY(-50%);
            width: .0267rem;
            height: 1.1467rem;
            background: #EDEEF2;
        }
        .left {
            width: 4.4533rem;
            box-sizing: border-box;
            .number {
                margin-top: .3467rem;
                height: .9067rem;
                font-size: .64rem;
                font-weight: bold;
                line-height: .9067rem;
                text-align: center;
                color: #2493F1;
                text-align: center;
            }
            .label {
                margin-top: .08rem;
                height: .48rem;
                font-size: .3467rem;
                line-height: .48rem;
                color: #666666;
                text-align: center;
            }
        }
        .right {
            width: 4.72rem;
            box-sizing: border-box;
            .amount {
                margin-top: .3467rem;
                height: .9067rem;
                font-size: .64rem;
                font-weight: bold;
                line-height: .9067rem;
                text-align: center;
                color: #F73131;
                span {
                    font-size: .3733rem;
                }
            }
            .label {
                margin-top: .08rem;
                height: .48rem;
                font-size: .3467rem;
                line-height: .48rem;
                color: #666666;
                text-align: center;
            }
        }
    }
    .tag-list {
        width: 10rem;
        height: 1.4933rem;
        display: flex;
        overflow: hidden;
        .item {
            margin-left: .5867rem;
            display: flex;
            flex-direction: column;
            align-items: center;
            cursor: pointer;
            .text {
                margin-top: .6133rem;
                height: .5333rem;
                font-size: .3733rem;
                line-height: .5333rem;
                color: #777777;
                text-align: center;
            }
            img {
                display: none;
                margin-top: .08rem;
                width: .4365rem;
                height: .1803rem;
            }
        }
        .item.active {
            .text {
                color: #000000;
                font-size: .5333rem;
            }
            img {
                display: block;
            }
        }
    }
    .list-wrap {
        margin: .4267rem auto 0;
        width: 9.2rem;
        overflow: hidden;
        .item {
            margin-bottom: .32rem;
            width: 9.2rem;
            height: 2.1867rem;
            border-radius: .2667rem;
            background: #FFFFFF;
            overflow: hidden;
            position: relative;
            .tag {
                width: 1.4667rem;
                height: .56rem;
                position: absolute;
                left: 0;
                top: 0;
                border-radius: .2667rem 0px .2667rem 0;
                background: #EAFEF5;
                text-align: center;
                font-size: .32rem;
                line-height: .56rem;
                color: #2EBC8C;
            }
            .tag.blue {
                background: #F1F8FF;
                color: #339CF3;
            }
            .orange {
                background: #FEF4EA;
                color: #F37D33;
            }
            .row {
                display: flex;
                .rank {
                    margin-top: .8267rem;
                    margin-left: .56rem;
                    width: .4533rem;
                    height: .5333rem;
                    font-size: .3733rem;
                    line-height: .5333rem;
                    color: #333333;
                }
                .avatar {
                    margin-top: .4267rem;
                    margin-left: .2667rem;
                    width: 1.3333rem;
                    height: 1.3333rem;
                    border-radius: 50%;
                    overflow: hidden;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .name-box {
                    margin-left: .2667rem;
                    .nickname {
                        margin-top: .6133rem;
                        height: .5333rem;
                        font-size: .3733rem;
                        line-height: .5333rem;
                        color: #333333;
                    }
                    .phone {
                        height: .48rem;
                        font-size: .3467rem;
                        line-height: .48rem;
                        color: #666666;
                    }
                }
            }
            .right-wrap {
                top: .1067rem;
                right: 0;
                position: absolute;
                height: 2.08rem;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                .btn {
                    margin-right: 20px;
                    margin-left: auto;
                    right: .5333rem;
                    top: .72rem;
                    width: 2.1333rem;
                    height: .8533rem;
                    border-radius: .4267rem;
                    text-align: center;
                    line-height: .8533rem;
                    font-size: .4rem;
                    background: #EEEEEE;
                    color: #666666;
                    cursor: pointer;
                }
                .btn.green {
                    color: #FFFFFF;
                    background: linear-gradient(90deg, #44D7B6 0%, #5EF2D2 100%), linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
                }
                .btn.blue {
                    color: #FFFFFF;
                    background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
                }
                .time {
                    margin-top: .1067rem;
                    margin-right: .4267rem;
                    margin-left: auto;
                    height: .48rem;
                    font-size: .32rem;
                    line-height: .48rem;
                    color: #EE2C2C;
                }
            }
        }
    }
}
/* 达人计划 */
.drjh-page {
    padding-bottom: .32rem;
    .content {
        margin:.32rem auto 0;
        width: 9.2rem;
        padding-bottom: 1.2267rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        overflow: hidden;
        .title-box {
            margin: .5333rem auto 0;
            height: .7467rem;
            display: flex;
            align-items: center;
            justify-content: center;
            .left {
                width: .8533rem;
                height: .0267rem;
                border-radius: .0267rem;
                background: linear-gradient(90deg, rgba(150, 150, 150, 0) 0%, #969696 100%);
            }
            .text {
                margin: 0 .32rem;
                height: .7467rem;
                font-size: .5333rem;
                line-height: .7467rem;
                color: #333333;
                span {
                    color: #2493F1
                }
            }
            .right {
                width: .8533rem;
                height: .0267rem;
                border-radius: .0267rem;
                background: linear-gradient(90deg, #969696 0%, rgba(150, 150, 150, 0) 100%);
            }
        }
        .current-task {
            margin-top: .5067rem;
            margin-left: .4rem;
            width: 2rem;
            height: .6133rem;
            line-height: .6133rem;
            text-align: center;
            background: #EAFEF5;
            color: #2EBC8C;
            font-size: .3467rem;
            border-radius: .2667rem;
            border-bottom-left-radius: 0;
        }
        .task-name {
            margin-top: .2667rem;
            margin-left: .4rem;
            height: .4267rem;
            font-size: .32rem;
            line-height: .4267rem;
            color: #646466;
        }
        .procedure-box {
            margin: .72rem auto 0;
            width: 7.8133rem;
            border-left: .0533rem solid #2493F1;
            box-sizing: border-box;
            padding-top: .4133rem;
            padding-bottom: .7067rem;
            position: relative;
            .title-1,.title-2 {
                position: absolute;
                top: -0.3333rem;
                left: .3733rem;
                height: .5867rem;
                font-size: .4267rem;
                line-height: normal;
                color: #000000;
            }
            .title-2 {
                top: auto;
                bottom: -0.2533rem;
            }
            .one,.two {
                position: absolute;
                top: -0.28rem;
                left: -0.3067rem;
                width: .56rem;
                height: .56rem;
                line-height: .56rem;
                border-radius: 50%;
                background: #2493F1;
                text-align: center;
                color: #FFFFFF;
                font-size: .4rem;
                font-weight: bold;
            }
            .two {
                top: auto;
                bottom: -0.28rem;
            }
            .qrcode {
                margin-left: .2667rem;
                width: 2.9067rem;
                height: 2.9067rem;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .qrcode-tips {
                margin-left: .3733rem;
                height: .4533rem;
                font-size: .32rem;
                line-height: .4533rem;
                color: #000000;
            }
            .red-tips {
                margin-top: .2667rem;
                margin-left: .3733rem;
                width: 7.0667rem;
                font-size: .32rem;
                line-height: .48rem;
                color: #EE2C2C;
            }
        }
        .form-box {
            margin-top: .4933rem;
            display: flex;
            align-items: center;
            height: 1.1733rem;
            input {
                margin-left: 1.12rem;
                width: 6.48rem;
                height: 1.1733rem;
                box-sizing: border-box;
                padding: .2667rem .2987rem .32rem;
                line-height: .5867rem;
                border-radius: .1067rem;
                background: #F6F6F6;
                font-size: .4267rem;
                color: #666666;
            }
            .add {
                margin-left: .2133rem;
                width: 1.0133rem;
                height: 1.0133rem;
                border-radius: 50%;
                background: #F6F6F6;
                color: rgba(102, 102, 102, 0.5);
                font-size: .96rem;
                display: flex;
                justify-content: center;
                align-items: center;
                cursor: pointer;
                img {
                    width: .5333rem;
                    height: .5333rem;
                }
            }
        }
        .phone-box {
            margin-top: .2933rem;
            height: .5333rem;
            display: flex;
            align-items: center;
            .phone {
                margin-left: 1.12rem;
                margin-right: .5067rem;
                height: .5333rem;
                font-size: .3733rem;
                line-height: .5333rem;
                color: #666666;
                span {
                    color: #2493F1
                }
            }
            .btn {
                padding: 0 .2667rem;
                height: .5333rem;
                line-height: .5333rem;
                border-radius: .2667rem;
                color: #FFFFFF;
                font-size: .3149rem;
                background: linear-gradient(90deg, #44D7B6 0%, #5EF2D2 100%);
                cursor: pointer;
            }
            .btn.blue {
                margin-left: .2667rem;
                background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
            }
        }
        .commit-btn {
            margin: .9067rem auto 0;
            width: 7.52rem;
            height: 1.0133rem;
            border-radius: .5067rem;
            line-height: 1.0133rem;
            background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
            font-size: .4rem;
            text-align: center;
            color: #FFFFFF;
        }
    }
}
/* 任务审核2 */
.taskaudit2-page {
    padding-bottom: .3733rem;
    .top-wrap {
        margin: .3733rem auto 0;
        width: 9.2rem;
        height: 2.3467rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        overflow: hidden;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .left {
            margin-left: .5333rem;
            display: flex;
            align-items: center;
            height: 2.3467rem;
            .avatar {
                width: 1.3333rem;
                height: 1.3333rem;
                border-radius: 50%;
                overflow: hidden;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .user-info {
                margin-left: .2667rem;
                .nickname {
                    height: .5333rem;
                    font-size: .3733rem;
                    line-height:.5333rem;
                    color: #333333;
                }
                .phone {
                    height: .48rem;
                    font-size: .3467rem;
                    line-height: .48rem;
                    color: #666666;
                }
            }
        }
        .right {
            margin-right: .7733rem;
            height: .48rem;
            font-size: .3733rem;
            line-height: .48rem;
            color: #EE2C2C;
        }
    }
    .content-wrap {
        margin: .32rem auto 0;
        width: 9.2rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        padding: .4rem .5333rem .7467rem;
        box-sizing: border-box;
        overflow: hidden;
        .title-box {
            display: flex;
            align-items: center;
            height: .5867rem;
            margin-bottom: .3733rem;
            .sy {
                width: .48rem;
                height: .16rem;
                transform: rotate(-90deg);
                border-radius: .8rem;
                background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
            }
            .title {
                margin-left: .2133rem;
                height: .5867rem;
                font-size: .4267rem;
                line-height: .5867rem;
                color: #000000;
            }
        }
        .order-no {
            padding-left: .2667rem;
            height: .5333rem;
            font-size: 14px;
            line-height:.5333rem;
            color: #666666;
            margin-bottom: .16rem;
        }
        .hr {
            margin-top: .3733rem;
            width: 8.1867rem;
            height: .0267rem;
            background: #EDEEF2;
        }
        .red-row {
            margin-top: .16rem;
            height: .56rem;
            display: flex;
            justify-content: space-between;
            align-items: baseline;
            .left {
                height: .56rem;
                display: flex;
                justify-content: space-between;
                align-items: baseline;
                .label {
                    height: .48rem;
                    font-size: .3467rem;
                    line-height: .48rem;
                    color: #666666;
                }
                .symbol {
                    color: #F73131;
                    font-size: .2704rem;
                }
                .amount {
                    height: .56rem;
                    font-size: .3931rem;
                    line-height: .56rem;
                    color: #F73131;
                }
            }
            .right {
                height: .48rem;
                font-size: .32rem;
                line-height: .48rem;
                color: #EE2C2C;
            }
        }
        .btn-list {
            margin: .8267rem auto 0;
            width: 7.2533rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 1.12rem;
            .btn {
                width: 3.36rem;
                height: 1.12rem;
                line-height: 1.12rem;
                border-radius: .56rem;
                background: linear-gradient(90deg, #44D7B6 0%, #5EF2D2 100%);
                font-size: .4rem;
                text-align: center;
                color: #FFFFFF;
                cursor: pointer;
            }
            .btn.blue {
                background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
            }
        }
        .reject-title {
            margin-top: 1.0933rem;
            height: .5867rem;
            font-size: .4267rem;
            line-height: .5867rem;
            color: #000000;
        }
        textarea {
            margin: .3467rem auto 0;
            width: 8.08rem;
            height: 3.5467rem;
            border-radius: .1067rem;
            background: #F6F6F6;
            resize: none;
            box-sizing: border-box;
            padding: .4267rem;
            font-size: .4267rem;
            color: #333333;
            line-height: .7467rem;
            overflow: hidden;
        }
    }
}
/* 市场级别 */
.market-level-page {
    padding-bottom: .32rem;
    .top-wrap {
        width: 10rem;
        height: 4.2133rem;
        position: relative;
        .layer-1 {
            position: absolute;
            top: .32rem;
            left: 50%;
            transform: translateX(-50%);
            width: 8.6667rem;
            height: 1.3867rem;
            border-radius: .2667rem;
            background: #232734;
        }
        .layer-2 {
            position: absolute;
            top: 1.36rem;
            left: 50%;
            transform: translateX(-50%);
            width: 9.2rem;
            height: 2.8533rem;
            border-radius: .2133rem;
            overflow: hidden;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .layer-3 {
            position: absolute;
            top: 0;
            left: 0;
            width: 10rem;
            height: 4.2133rem;
            .money-box {
                height: .8rem;
                line-height: .8rem;
                font-size: .8rem;
                color: #FFDBB5;
                span {
                    font-size: .64rem
                }
            }
            .title-box {
                margin-top: .5867rem;
                display: flex;
                justify-content: center;
                align-items: center;
                .left {
                    width: .5333rem;
                    height: .5333rem;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .right {
                    margin-left: .16rem;
                    height: .5867rem;
                    line-height: .5867rem;
                    color: #FFE1C0;
                    font-size: .3733rem;
                }
            }
            .middle-box {
                margin-top: .6133rem;
                display: flex;
                justify-content: space-between;
                align-items: center;
                height: .5707rem;
                line-height: .5707rem;
                .left {
                    margin-left: 1.04rem;
                    color: #FFDBB5;
                    font-size: .32rem;
                }
                .right {
                    margin-right: .7733rem;
                    width: 1.7867rem;
                    height: .5707rem;
                    line-height: .5707rem;
                    border-radius: .32rem;
                    background: linear-gradient(90deg, #FFEACB 0%, #E8BC77 100%);
                    text-align: center;
                    color: #333333;
                    font-size: .32rem;
                    cursor: pointer;
                }
            }
            .fenhong-box {
                margin-top: .5467rem;
                display: flex;
                overflow: hidden;
                .text {
                    margin-right: .1067rem;
                    margin-top: .3733rem;
                    margin-left: 1.04rem;
                    height: .32rem;
                    line-height: .32rem;
                    color: #FFDBB5;
                    font-size: .32rem;
                }
            }
            .bottom-box {
                margin: .2013rem auto 0;
                display: flex;
                justify-content: space-between;
                width: 9.2rem;
                .item {
                    width: 4.5867rem;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    .text {
                        margin-top: .1333rem;
                        height: .32rem;
                        line-height: .32rem;
                        font-size: .32rem;
                        font-weight: 600;
                        color: #FFDBB5;
                    }
                }
            }
        }
    }
    .content-wrap {
        margin: .32rem auto 0;
        width: 9.2rem;
        padding-bottom: .8533rem;
        background: #FFFFFF;
        border-radius: .2667rem;
        overflow: hidden;
        .top-box {
            margin-top: .4267rem;
            display: flex;
            align-items: center;
            height: .5867rem;
            .fh {
                margin-left: .4533rem;
                margin-right: .24rem;
                width: .48rem;
                height: .16rem;
                transform: rotate(-90deg);
                border-radius: .8rem;
                background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
            }
            .title {
                height: .5867rem;
                line-height: .5867rem;
                color: #000000;
                font-size: .4267rem;
                font-weight: 600;
            }
        }
        .table-header {
            margin: .24rem auto 0;
            width: 8.48rem;
            height: .8267rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            background: rgba(246, 246, 246, 0.6);
            padding: 0 1.0133rem 0 .4rem;
            box-sizing: border-box;
            div {
                height: .5333rem;
                line-height: .5333rem;
                font-size: .3733rem;
                color: #333333;
            }
        }
        .list {
            margin: 0 auto;
            width: 8.48rem;
            .row {
                height: 1.68rem;
                align-items: center;
                display: flex;
                border-bottom: .0267rem solid #EDEEF2;
                .datetime {
                    padding-left: .32rem;
                    box-sizing: border-box;
                    width: 2.4533rem;
                    color: #777777;
                    font-size: .32rem;
                    line-height: .4533rem;
                    display: flex;
                    flex-direction: column;
    
                }
                .middle {
                    width: 3.3067rem;
                    height: 1.68rem;
                    line-height: 1.68rem;
                    text-align: center;
                    color: #777777;
                    font-size: .32rem;
                }
                .last {
                    width: 2.7467rem;
                    height: .56rem;
                    line-height: .56rem;
                    font-size: .3931rem;
                    color: #F73131;
                    text-align: center;
                    span {
                        font-size: .2704rem;
                    }
                }
            }
        }
    }
}
/* 登录 */
.login-page {
    padding-bottom: 1.4933rem;
    .content-wrap {
        margin: 0 auto;
        width: 8.2933rem;
        .hi {
            margin-top: .64rem;
            height: 1.2rem;
            line-height: 1.2rem;
            color: #303030;
            font-size: .8533rem;
        }
        .welcome {
            margin-top: .1067rem;
            margin-bottom: .5333rem;
            height: .5867rem;
            line-height: .5867rem;
            color: #303030;
            font-size: .4267rem;
        }
        .input-wrap {
            height: 1.6rem;
            border-bottom: .0133rem solid #EDEEF2;
            overflow: hidden;
            position: relative;
            input {
                margin-top: .88rem;
                width: 70%;
                height: .5333rem;
                font-size: .3733rem;
                line-height: .5333rem;
                color: #333333;
            }
            input::placeholder {
                font-size: .3733rem;
                color: #B6BDBD;
            }
            .send-code {
                position: absolute;
                right: 0;
                bottom: .16rem;
                position: absolute;
                height: .5333rem;
                font-size: .3733rem;
                line-height: .5333rem;
                color: #397BFF;
                cursor: pointer;
            }
        }
        .jump-list {
            margin-top: .4267rem;
            line-height: .4267rem;
            height: .4267rem;
            display: flex;
            justify-content: space-between;
            a {
                color: #646466;
                font-size: .32rem;
            }
        }
        .tips {
            margin-top: .32rem;
            height: .4267rem;
            font-size: .32rem;
            line-height: .4267rem;
            color: #646466;
        }
        .commit-btn {
            margin-top: .8533rem;
            width: 8.2933rem;
            height: 1.28rem;
            line-height: 1.28rem;
            border-radius: .64rem;
            background: #2493F1;
            color: #FFFFFF;
            font-size: .4267rem;
            text-align: center;
            cursor: pointer;
        }
        .commit-btn.disable {
            background: #C6C7CB;
        }
        .protocol {
            position: fixed;
            left: 50%;
            width: 10rem;
            transform: translateX(-50%);
            bottom: .32rem;
            line-height: .4267rem;
            font-size: .2933rem;
            color: #646466;
            text-align: center;
            a {
                color: #1A66FF;
                cursor: pointer;
            }
        }
    }
}
/* 积分商场 */
.point-mall-page {
    padding-bottom: .32rem;
    .banner {
        margin: .2933rem auto .24rem;;
        width: 9.36rem;
        height: 3.8667rem;
        border-radius: .16rem;
        overflow: hidden;
        #carousel1 {
            width: 100%;
            height: 100%;
            .carousel-item {
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .carousel-dots {
                left: 50%;
                transform: translateX(-50%);
                bottom: .2133rem;
                .dot {
                    margin-right: .1067rem;
                    width: .1067rem;
                    height: .1067rem;
                    border-radius: .0533rem;
                    background: #FFFFFF;
                }
                .dot.active {
                    width: .4267rem;
                }
            }
        }
    }
    .tag-wrap {
        height: 1.4933rem;
        overflow: hidden;
        .tag-list::-webkit-scrollbar {
            display: none;
        }
        .tag-list {
            padding-left: .4133rem;
            width: 10rem;
            box-sizing: border-box;
            height: 1.4933rem;
            display: flex;
            overflow-x: scroll;
            background: #FFFFFF;
            .item {
                padding: 0 .2rem;
                height: 1.4933rem;
                position: relative;
                width: 3.2rem;
                cursor: pointer;
                .text {
                    margin-top: .56rem;
                    height: .5333rem;
                    font-size: .3733rem;
                    line-height: .5333rem;
                    text-wrap: none;
                    color: #777777;
                    white-space: nowrap;
                }
                img {
                    position: absolute;
                    display: none;
                    margin-top: .08rem;
                    bottom: .1131rem;
                    left: 50%;
                    transform: translateX(-50%);
                    width: .4365rem;
                    height: .1803rem;
                }
            }
            .item.active {
                .text {
                    margin-top: .3733rem;
                    height: .7467rem;
                    line-height: .7467rem;
                    color: #000000;
                    font-size: .5333rem;
                }
                img {
                    display: block;
                }
            }
        }
    }
    .product-list {
        display: flex;
        flex-wrap: wrap;
        .item {
            margin-left: .32rem;
            margin-top: .2667rem;
            width: 4.5333rem;
            height: 6.5333rem;
            border-radius: .1067rem;
            background: #FFFFFF;
            overflow: hidden;
            .image {
                width: 4.5333rem;
                height: 4.5333rem;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .title {
                margin: .4rem auto 0;
                width: 4rem;
                height: .4rem;
                font-size: .4rem;
                line-height: .4rem;
                color: #333333;
            }
            .bottom-box {
                margin: .2933rem auto 0;
                width: 4rem;
                height: .64rem;
                display: flex;
                justify-content: space-between;
                .left {
                    height: .64rem;
                    display: flex;
                    align-items: center;
                    img {
                        width: .3733rem;
                        height: .3733rem;
                    }
                    span {
                        height: .4267rem;
                        line-height: .4267rem;
                        color: #3467F8;
                        font-size: .4267rem;
                    }
                }
                .right {
                    width: 1.8667rem;
                    height: .64rem;
                    line-height: .64rem;
                    border-radius: .32rem;
                    background: linear-gradient(90deg, #7ADCFA 0%, #3467F8 100%);
                    box-shadow: 0px 3px 6px 0px rgba(122, 220, 250, 0.29);
                    color: #FFFFFF;
                    font-size: .32rem;
                    text-align: center;
                    cursor: pointer;
                }
            }
        }
    }
}
/* 商品详情 */
.product-page {
    .top-wrap {
        width: 10rem;
        height: 10rem;
        position: relative;
        overflow: hidden;
        #carousel1 {
            width: 10rem;
            height: 10rem;
            .carousel-item {
                img {
                    width: 100%;
                    height: 100%;
                }
            }
        }
        .go-down {
            position: absolute;
            left: .4533rem;
            top: .2933rem;
            width: .5867rem;
            height: .5867rem;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            img {
                width: .3733rem;
                height: .1867rem;
            }
        }
        .title {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            top: .3733rem;
            width: 6.9333rem;
            font-size: .4267rem;
            font-weight: 500;
            height: .4267rem;
            line-height: .4267rem;
            text-align: center;
            color: #FFFFFF;
        }
        .carousel-page {
            position: absolute;
            right: .4rem;
            bottom: .4rem;
            width: 1.3333rem;
            height: .5333rem;
            line-height: .5333rem;
            border-radius: .2667rem;
            background: rgba(0, 0, 0, 0.4);
            color: #FFFFFF;
            font-size: .4rem;
            text-align: center;
        }

    }
    .info-box {
        width: 10rem;
        height: 1.8667rem;
        background: #FFFFFF;
        overflow: hidden;
        .title {
            margin: .2667rem auto 0;
            width: 9.2rem;
            height: .48rem;
            line-height: .48rem;
            font-size: .48rem;
            color: #333333;
        }
        .bt {
            margin: .2933rem;
            width: 9.2rem;
            height: .5333rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .left {
                height: .5333rem;
                display: flex;
                align-items: center;
                img {
                    width: .48rem;
                    height: .48rem;
                }
                span {
                    margin-left: .1067rem;
                    height: .5333rem;
                    font-size: .5333rem;
                    line-height: .5333rem;
                    color: #3467F8;
                }
                .market-price {
                    margin-left: .4267rem;
                    height: .5333rem;
                    display: flex;
                    align-items: center;
                    border-radius: .0267rem;
                    box-sizing: border-box;
                    border: 1px solid #0F5A7A;
                    .text {
                        height: .4267rem;
                        line-height: .4267rem;
                        font-size: .2667rem;
                        padding: 0 .0533rem;
                        background: #E0F7FF;
                    }
                    .price {
                        padding: 0 .1067rem;
                        height: .2667rem;
                        font-size: .2667rem;
                        line-height: .2667rem;
                        color: #0F5A7A;
                    }
                }
            }
            .right {
                display: flex;
                height: .2667rem;
                align-items: center;
                .text {
                    height: .2667rem;
                    line-height: .2667rem;
                    font-size: .2667rem;
                    color: #999999;
                }
                .li {
                    margin: 0 .2667rem;
                    width: 1px;
                    height: .2133rem;
                    background: #CCCCCC;
                }
            }
        }
    }
    .options-wrap {
        margin: .24rem auto 0;
        width: 9.52rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        padding: .4267rem .3467rem;
        box-sizing: border-box;
        .row-1,.row-2 {
            margin-bottom: .64rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: .5333rem;
            .left {
                height: .5333rem;
                display: flex;
                align-items: center;
                .label {
                    font-size: .3733rem;
                    font-weight: 500;
                    color: #999999;
                    height: .5333rem;
                    line-height: .5333rem;
                }
                .value {
                    margin-left: .4533rem;
                    font-size: .3733rem;
                    font-weight: 500;
                    color: #333333;
                    height: .5333rem;
                    line-height: .5333rem;
                    span {
                        color: #CCCCCC
                    }
                }
            }
            .right {
                width: .3733rem;
                height: .3733rem;
                cursor: pointer;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
        }
        .row-3 {
            height: .4533rem;
            font-size: .32rem;
            font-weight: 500;
            line-height: .4533rem;
            color: #CCCCCC;
            span {
                margin: 0 .2667rem;
            }
        }
    }
    .product-detail {
        margin: .2667rem auto 0;
        width: 10rem;
        background: #FFFFFF;
        box-shadow: inset 0px -0.5px 0px 0px #DDDDDD;
        .detail-top {
            width: 10rem;
            height: 1.0667rem;
            background: #FFFFFF;
            box-shadow: inset 0px -0.5px 0px 0px #DDDDDD;
            display: flex;
            .zz {
                margin-top: .3467rem;
                margin-left: .4rem;
                width: .1067rem;
                height: .3733rem;
                border-radius: .0533rem;
                background: #0F5A7A;
            }
            .title {
                margin-top: .32rem;
                margin-left: .1333rem;
                height: .48rem;
                font-size: .48rem;
                line-height: .48rem;
                color: #333333;
            }
        }
        .content {
            margin: .2933rem auto 0;
            padding-bottom: .2933rem;
            overflow: hidden;
            width: 9.2rem;
            font-size: .3733rem;
            line-height: .5333rem;
            color: #333333;
            img {
                width: 100%;
                height: auto;
            }
        }
    }
    .bottom-wrap {
        .z-height {
            height: 1.6rem;
        }
        .fixed-bottom {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 10rem;
            height: 1.6rem;
            background: #FFFFFF;
            box-shadow: inset 0px 0.5px 0px 0px #DDDDDD;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .left {
                margin-left: .4rem;
                .text {
                    height: .2667rem;
                    font-size: .2667rem;
                    line-height: .2667rem;
                    color: #999999;
                }
                .price {
                    margin-top: .1333rem;
                    height: .3733rem;
                    font-size: .3733rem;
                    line-height: .3733rem;
                    color: #F54414;
                }
            }
            .right {
                margin-right: .4rem;
                width: 5.52rem;
                height: 1.1733rem;
                line-height: 1.1733rem;
                border-radius: 220px;
                background: linear-gradient(90deg, #7ADCFA 0%, #3467F8 100%);
                box-shadow: 0px 3px 6px 0px rgba(122, 220, 250, 0.29);
                color: #FFFFFF;
                font-size: .48rem;
                text-align: center;
                cursor: pointer;
            }
        }
        
    }
}
/* 确认订单 */
.checkout-page {
    .address-wrap {
        margin: .16rem auto 0;
        padding: .4267rem 0;
        width: 9.1467rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        display: flex;
        align-items: center;
        position: relative;
        .position {
            margin-left: .32rem;
            width: .7467rem;
            height: .7467rem;
            background: #F7F7F7;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            img {
                width: .3733rem;
                height: .3733rem;
            }
        }
        .info {
            margin-left: .32rem;
            width: 6.9333rem;
            .address {
                width: 100%;
                color: #1A1A1A;
                font-size: .4rem;
                font-weight: bold;
                line-height: .56rem;
            }
            .name-phone {
                margin-top: .1067rem;
                width: 100%;
                line-height: .48rem;
                font-size: .3467rem;
                font-weight: 500;
                color: #666666;
            }
        }
        .right {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            right: .32rem;
            width: .4267rem;
            height: .4267rem;
            cursor: pointer;
            img {
                width: 100%;
                height: 100%;
            }
        }
    }
    .order-info {
        margin: .32rem auto 0;
        width: 9.1467rem;
        height: 6.7733rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        padding: .32rem 0 .56rem;
        box-sizing: border-box;
        .product-info {
            margin: 0 auto;
            width: 8.8267rem;
            display: flex;
            position: relative;
            margin-bottom: .64rem;
            .left {
                width: 2.4rem;
                height: 2.4rem;
                border-radius: .16rem;
                overflow: hidden;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .right {
                margin-left: .2133rem;
                .title {
                    margin-top: .1867rem;
                    width: 5.8667rem;
                    height: .56rem;
                    font-size: .4rem;
                    font-weight: bold;
                    line-height: .56rem;
                    color: #1A1A1A;
                }
                .subtitle {
                    margin-top: .0533rem;
                    width: 5.8667rem;
                    height: .48rem;
                    font-size: .3467rem;
                    font-weight: 500;
                    line-height: .48rem;
                    color: #999999;
                }
                .price {
                    margin-top: .4533rem;
                    height: .5067rem;
                    font-size: .4267rem;
                    font-weight: 500;
                    line-height: .5067rem;
                    color: #1A1A1A;
                }
            }
            .number {
                position: absolute;
                right: .32rem;
                bottom: .2667rem;
                font-size: .3733rem;
                height: .4267rem;
                line-height: .4267rem;
                color: #999999;
            }
        }
        .amount-row {
            margin: 0 auto .4267rem;
            width: 8.5067rem;
            display: flex;
            height: .5333rem;
            line-height: .5333rem;
            justify-content: space-between;
            align-items: center;
            .left {
                height: .5333rem;
                font-size: .3733rem;
                font-weight: 500;
                line-height: .5333rem;
                color: #333333;
            }
            .right {
                height: .5333rem;
                display: flex;
                align-items: center;
                img {
                    width: .3733rem;
                    right: .3733rem;
                    margin-right: .1067rem;
                }
                span {
                    height: .4267rem;
                    font-size: .4267rem;
                    line-height: .4267rem;
                    color: #3467F8;
                }
            }
        }
        .hr {
            margin: 0 auto;
            width: 8.5067rem;
            height: .0267rem;
            background: #F7F7F7;
        }
        .total-row {
            margin: .4533rem auto 0;
            width: 8.5067rem;
            display: flex;
            height: .48rem;
            align-items: center;
            .left {
                margin-left: auto;
                margin-right: 0;
                height: .48rem;
                font-size: .3733rem;
                font-weight: 500;
                line-height: .48rem;
                color: #333333;
            }
            .right {
                margin-right: 0;
                height: .48rem;
                display: flex;
                align-items: center;
                img {
                    width: .3733rem;
                    right: .3733rem;
                    margin-right: .1067rem;
                }
                span {
                    height: .4267rem;
                    font-size: .4267rem;
                    line-height: .4267rem;
                    color: #3467F8;
                }
            }
        }
    }
    .payment-box {
        margin: .2933rem auto 0;
        width: 9.1467rem;
        height: 1.3867rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 .32rem;
        box-sizing: border-box;
        .left {
            font-size: .3733rem;
            font-weight: 500;
            color: #333333;
        }
        .right {
            display: flex;
            align-items: center;
            height: .5333rem;
            cursor: pointer;
            span {
                font-size: .3733rem;
                font-weight: 500;
                color: #333333;
            }
            img {
                margin-left: .1067rem;
                width: .32rem;
                height: .32rem;
            }
        }
    }
    .bottom-wrap {
        .z-height {
            height: 1.6rem;
        }
        .fixed-bottom {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 10rem;
            height: 1.6rem;
            background: #FFFFFF;
            box-shadow: inset 0px 0.5px 0px 0px #DDDDDD;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .left {
                margin-left: .4rem;
                .text {
                    height: .2667rem;
                    font-size: .2667rem;
                    line-height: .2667rem;
                    color: #999999;
                }
                .price {
                    margin-top: .1333rem;
                    height: .3733rem;
                    font-size: .3733rem;
                    line-height: .3733rem;
                    color: #F54414;
                }
            }
            .right {
                margin-right: .4rem;
                width: 5.52rem;
                height: 1.1733rem;
                line-height: 1.1733rem;
                border-radius: .5867rem;
                background: linear-gradient(90deg, #7ADCFA 0%, #3467F8 100%);
                box-shadow: 0px 3px 6px 0px rgba(122, 220, 250, 0.29);
                color: #FFFFFF;
                font-size: .48rem;
                text-align: center;
                cursor: pointer;
            }
        }
        
    }
}
/* 全部订单 */
.order-list-page {
    .tab-list {
        height: 1.1733rem;
        display: flex;
        align-items: center;
        background: #FFFFFF;
        .item {
            flex: 1;
            text-align: center;
            height: 1.1733rem;
            line-height: 1.1733rem;
            font-size: .3733rem;
            font-weight: 500;
            color: #666666;
            cursor: pointer;
        }
        .item.active {
            font-weight: bold;
            color: #1A66FF;
        }
    }
    .order-list {
        padding-bottom: .32rem;
        .item {
            margin: .32rem auto 0;
            width: 9.1467rem;
            height: 4.4267rem;
            border-radius: .2667rem;
            background: #FFFFFF;
            position: relative;
            overflow: hidden;
            .product-info {
                margin: .32rem auto;
                width: 8.5067rem;
                display: flex;
                position: relative;
                .left {
                    width: 2.4rem;
                    height: 2.4rem;
                    border-radius: .16rem;
                    overflow: hidden;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .right {
                    margin-left: .2133rem;
                    .title {
                        margin-top: .1867rem;
                        width: 4.8rem;
                        height: .5333rem;
                        font-size: .3733rem;
                        font-weight: bold;
                        line-height: .5333rem;
                        color: #1A1A1A;
                    }
                    .subtitle {
                        margin-top: .08rem;
                        width: 4.8rem;
                        height: .48rem;
                        font-size: .32rem;
                        font-weight: 500;
                        line-height: .48rem;
                        color: #999999;
                    }
                    .price {
                        margin-top: .4533rem;
                        height: .4267rem;
                        font-weight: 500;
                        display: flex;
                        align-items: center;
                        img {
                            margin-right: .1067rem;
                            width: .3733rem;
                            height: .3733rem;
                        }
                        span {
                            height: .4267rem;;
                            font-size: .4267rem;;
                            font-weight: normal;
                            line-height: .4267rem;;
                            color: #3467F8;
                        }
                    }
                }
            }
            .status {
                position: absolute;
                top: .32rem;
                right: .32rem;
                height: .4533rem;
                font-size: .32rem;
                font-weight: 500;
                line-height: .4533rem;
                color: #CCCCCC;
            }
            .number {
                position: absolute;
                top: 2.0533rem;
                right: .3467rem;
                height: .4rem;
                font-size: .3467rem;
                font-weight: 500;
                line-height: .4rem;
                color: #999999;
            }
            .btn-list {
                margin: .4267rem auto 0;
                width: 8.5067rem;
                display: flex;
                flex-direction: row-reverse;
                .btn {
                    padding: 0 .3733rem;
                    height: .8533rem;
                    line-height: .8533rem;
                    border-radius: .2133rem;
                    box-sizing: border-box;
                    border: .0267rem solid #CCCCCC;
                    font-size: 14px;
                    font-weight: 500;
                    color: #333333;
                    margin-left: .1333rem;
                }
                .btn.blue {
                    border: none;
                    color: #FFFFFF;
                    background: linear-gradient(90deg, #7ADCFA 0%, #3467F8 100%);
                }
            }
        }
    }
}
/* 订单详情 */
.order-detail-page {
    padding-bottom: .32rem;
    .order-info {
        margin: .2667rem auto 0;
        width: 9.1467rem;
        height: 6.7733rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        padding: .32rem 0 .56rem;
        box-sizing: border-box;
        .product-info {
            margin: 0 auto;
            width: 8.8267rem;
            display: flex;
            position: relative;
            margin-bottom: .64rem;
            .left {
                width: 2.4rem;
                height: 2.4rem;
                border-radius: .16rem;
                overflow: hidden;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .right {
                margin-left: .2133rem;
                .title {
                    margin-top: .1867rem;
                    width: 5.8667rem;
                    height: .56rem;
                    font-size: .4rem;
                    font-weight: bold;
                    line-height: .56rem;
                    color: #1A1A1A;
                }
                .subtitle {
                    margin-top: .0533rem;
                    width: 5.8667rem;
                    height: .48rem;
                    font-size: .3467rem;
                    font-weight: 500;
                    line-height: .48rem;
                    color: #999999;
                }
                .price {
                    margin-top: .4533rem;
                    height: .5067rem;
                    font-size: .4267rem;
                    font-weight: 500;
                    line-height: .5067rem;
                    color: #1A1A1A;
                }
            }
            .number {
                position: absolute;
                right: .32rem;
                bottom: .2667rem;
                font-size: .3733rem;
                height: .4267rem;
                line-height: .4267rem;
                color: #999999;
            }
        }
        .amount-row {
            margin: 0 auto .4267rem;
            width: 8.5067rem;
            display: flex;
            height: .5333rem;
            line-height: .5333rem;
            justify-content: space-between;
            align-items: center;
            .left {
                height: .5333rem;
                font-size: .3733rem;
                font-weight: 500;
                line-height: .5333rem;
                color: #333333;
            }
            .right {
                height: .5333rem;
                display: flex;
                align-items: center;
                img {
                    width: .3733rem;
                    right: .3733rem;
                    margin-right: .1067rem;
                }
                span {
                    height: .4267rem;
                    font-size: .4267rem;
                    line-height: .4267rem;
                    color: #3467F8;
                }
            }
        }
        .hr {
            margin: 0 auto;
            width: 8.5067rem;
            height: .0267rem;
            background: #F7F7F7;
        }
        .total-row {
            margin: .4533rem auto 0;
            width: 8.5067rem;
            display: flex;
            height: .48rem;
            align-items: center;
            .left {
                margin-left: auto;
                margin-right: 0;
                height: .48rem;
                font-size: .3733rem;
                font-weight: 500;
                line-height: .48rem;
                color: #333333;
            }
            .right {
                margin-right: 0;
                height: .48rem;
                display: flex;
                align-items: center;
                img {
                    width: .3733rem;
                    right: .3733rem;
                    margin-right: .1067rem;
                }
                span {
                    height: .4267rem;
                    font-size: .4267rem;
                    line-height: .4267rem;
                    color: #3467F8;
                }
            }
        }
    }
    .address-wrap {
        margin: .2667rem auto 0;
        padding: .4267rem 0;
        width: 9.1467rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        display: flex;
        align-items: center;
        position: relative;
        .position {
            margin-left: .32rem;
            width: .7467rem;
            height: .7467rem;
            background: #F7F7F7;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            img {
                width: .3733rem;
                height: .3733rem;
            }
        }
        .info {
            margin-left: .32rem;
            width: 6.9333rem;
            .address {
                width: 100%;
                color: #1A1A1A;
                font-size: .4rem;
                font-weight: bold;
                line-height: .56rem;
            }
            .name-phone {
                margin-top: .1067rem;
                width: 100%;
                line-height: .48rem;
                font-size: .3467rem;
                font-weight: 500;
                color: #666666;
            }
        }
        .right {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            right: .32rem;
            width: .4267rem;
            height: .4267rem;
            cursor: pointer;
            img {
                width: 100%;
                height: 100%;
            }
        }
    }
    .detail-wrap {
        margin: .24rem auto 0;
        width: 9.1467rem;
        border-radius: .2667rem;
        background: #FFFFFF;
        padding: .4267rem .32rem .0533rem;
        box-sizing: border-box;
        .row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: .32rem;
            color: #999999;
            font-size: .3733rem;
            height: .5067rem;
            line-height: .5067rem;
            .right {
                display: flex;
                align-items: center;
                height: .5067rem;
                .copy {
                    margin-right: .1333rem;
                    height: .4267rem;
                    font-size: .32rem;
                    font-weight: 300;
                    line-height: .4267rem;
                    color: #1A66FF;
                    cursor: pointer;
                }
            }
        }
    }
    .bottom-wrap {
        .z-height {
            height: 1.6rem;
        }
        .fixed-bottom {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 10rem;
            height: 1.6rem;
            background: #FFFFFF;
            box-shadow: inset 0px 0.5px 0px 0px #DDDDDD;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 1.0133rem;
            box-sizing: border-box;
            .left,.right {
                margin-right: .4rem;
                width: 5.52rem;
                height: 1.12rem;
                line-height: 1.12rem;
                border-radius: .56rem;
                background: linear-gradient(90deg, #2493F1 0%, #7DC7FF 100%);
                color: #FFFFFF;
                font-size: .4rem;
                text-align: center;
                cursor: pointer;
            }
            .left {
                background: linear-gradient(90deg, #44D7B6 0%, #5EF2D2 100%);
            }
        }
        
    }
}
